var fs = require("fs");
var path = require("path");
var webpack = require("webpack");
var HtmlWebpackPlugin = require('html-webpack-plugin')

var lessToJs = require('less-vars-to-js');
var babelConfig = require('./.babel.config.js');
var cwd = path.join(__dirname + '/../');

// var themer = lessToJs(fs.readFileSync(path.join(cwd, '/src/theme.less'), 'utf8'));

var SWPlugin = require('serviceworker-webpack-plugin');

module.exports = {
    entry: {
        app: path.join(cwd + '/src/app.js'),
        // vender: ['react', 'react-dom', 'react-router-dom', 'react-loadable']
    },
    output: {
        path: path.join(cwd + '/dist'),
        filename: '[name]_[hash:8].js'
    },
    resolve: {
        modules: [path.join(cwd, "/src"), path.join(cwd, "/node_modules"), 'node_modules'],
        extensions: ['*', '.js', '.jsx', '.ts', '.tsx','.less'],
        alias: {
            'lib': path.join(cwd, "/src/lib"),
            'utils': path.join(cwd, "/src/utils"),
            'ts': path.join(cwd, "/src/ts")
        }
    },
    module: {
        rules: [{
            test: /(\.tsx|\.ts)$/,
            loader: 'awesome-typescript-loader'
        },{
            test: /(\.jsx|\.js)$/,
            use: [{
                loader: 'babel-loader',
                options: babelConfig
            }],
            exclude: /node_modules/
        }, {
            test: /\.css$/,
            use: [{
                loader: 'style-loader'
            }, {
                loader: 'css-loader'
            }]
        }, {
            test: /\.scss$/,
            use: [{
                loader: "style-loader" // creates style nodes from JS strings
            }, {
                loader: "css-loader" // translates CSS into CommonJS
            },{
                loader: "postcss-loader",
                options: {
                    sourceMap: true,
                    plugins: [
                        require('autoprefixer')({
                            browsers: ['> 0.5%', 'last 5 versions']
                        })
                    ]
                }
            }, {
                loader: "sass-loader" // compiles Less to CSS
            }]
        }, {
            test: /\.less$/,
            use: [{
                loader: "style-loader" // creates style nodes from JS strings
            }, {
                loader: "css-loader" // translates CSS into CommonJS
            }, {
                loader: "less-loader" // compiles Less to CSS
                // options: {
                //     sourceMap: true,
                //     modifyVars: JSON.stringify(themer)
                // }
            }]
        }]
    },
    plugins: [
        new HtmlWebpackPlugin({
            inject: 'body',
            template: 'src/index.html'
        }),

        // new webpack.optimize.CommonsChunkPlugin({
        //     name: 'vender',
        //     minChunks: 2
        // }),

        new webpack.optimize.CommonsChunkPlugin({
            // name: 'common',
            children: true,
            async: true
        }),

        // new SWPlugin({
        //     entry: path.join(cwd, '/src/sw.js')
        // })
    ]
}